import React, { useEffect, useState } from "react";
import { Descriptions,Card, Button} from "antd";

// 引入请求
import {hosListDetailRequest} from '@api/hospital/hospitalList'

// 引入类型
import {hosListDetailType} from "@api/hospital/model/hospitalListType"
import { useNavigate, useParams } from "react-router-dom";


export default function HospitalDetail() {
  const navigate = useNavigate()
  const {id} = useParams()
  //设置医院详情信息的state
  const [hosDetail,setHosDetail] = useState<hosListDetailType>({}) 


  // 一进来就发送请求获取医院详情数据
  useEffect(()=>{
    const gethosDetail = async ()=>{
      const re = await hosListDetailRequest(id as string)
      console.log(re);
      
      setHosDetail(re)
    }
    gethosDetail()
  },[])
  return (
    <div>
      <Card>
      <Descriptions title="基本信息" bordered column={2}>
        <Descriptions.Item label="医院名称">{hosDetail.hospital?.hosname}</Descriptions.Item>
        <Descriptions.Item label="医院logo">
          {
            ((hosDetail.hospital)?.logoData)?
            (<img width={200} src={`data:image/jpeg;base64,${hosDetail.hospital?.logoData}`} alt="" />):
            ('')
          }
        </Descriptions.Item>
        <Descriptions.Item label="医院编码">{hosDetail.hospital?.hoscode}</Descriptions.Item>
        <Descriptions.Item label="医院地址">{hosDetail.hospital?.param.fullAddress}</Descriptions.Item>
        <Descriptions.Item label="坐车地址" span={2}>{hosDetail.hospital?.route}</Descriptions.Item>
        <Descriptions.Item label="医院简介" span={2}>{hosDetail.hospital?.intro}</Descriptions.Item>
      </Descriptions>
      <Descriptions title="预约规则信息" bordered column={2} style={{marginTop:60}}>
        <Descriptions.Item label="预约周期">{hosDetail.bookingRule?.cycle}</Descriptions.Item>
        <Descriptions.Item label="放号时间">{hosDetail.bookingRule?.releaseTime}</Descriptions.Item>
        <Descriptions.Item label="停挂时间">{hosDetail.bookingRule?.stopTime}</Descriptions.Item>
        <Descriptions.Item label="退号时间">{hosDetail.bookingRule?.quitTime
        
        }</Descriptions.Item>
        <Descriptions.Item label="预约规则" span={2}>{hosDetail.bookingRule?.rule.map((item,index)=><p key={index}>{item}</p>)}</Descriptions.Item>
      </Descriptions>
      <Button type="default" style={{marginTop:20}} onClick={()=>{navigate(-1)}}>返回</Button>
      </Card>
    </div>
  );
}
